<template id="all">
    <div class="all">

		<div class="all_payment1"  v-for="(item, index) in orders">
            <div class="all_payment1_border"></div>
            <div class="all_payment1_1">
				<span>{{item.send}}</span>
                <span>{{item.order_sn}}</span>
                <span>{{item.status_tips}}</span>
            </div>
			
			<div  class="all_payment_2" v-if="item.num == 1"  @click="order_info(item.order_id,item.pay_status,item.order_status)" >
					<span>{{item.goods[0]['goods_name']}}</span>
					<span>{{item.goods[0]['goods_share']}} {{item.goods[0]['goods_weight']}}</span>
					<span>×{{item.goods[0]['goods_number']}}</span>
					<img v-bind:src="item.goods[0]['goods_thumb']" alt="">
            </div>
			
            <div class="all_payment1_2" v-if="item.num > 1"   @click="order_info(item.order_id,item.pay_status,item.order_status)">
					<div v-for="(v, k) in item.goods">
						<img v-bind:src="v['goods_thumb']" alt="">
					</div>
					
            </div>
            <p class="all_payment1_p">
                 共{{item.num}}件商品 合计 ：<time>¥{{item.order_amount}}</time><span v-if="item.is_fee == 1">(包邮)</span>
            </p>
			
			<!--待付款-->
            <p class="all_payment1_p1" v-if="(item.pay_status == 0 || item.pay_status == 1 ) && item.shipping_status == 0">
				    <span  @click="call()">联系客服</span>
					<span @click="order_cancel(index,item.order_id)">取消订单</span>
					<span v-if="item.order_status == 3"  @click="order_again(item.order_id)">再次购买</span>
                    <span v-else @click="order_pay(item.order_id,item.pay_id)">立即支付</span>
            </p>
			<!--待发货-->
			<p class="all_payment1_p1"  v-if="item.pay_status == 2 && item.shipping_status == 0">
					<span @click="call()">联系客服</span>
					<span @click="back(item.order_id)">申请退款</span>
            </p>
			<!--待收货-->
			<p class="all_payment1_p1"  v-if="item.pay_status == 2 && item.shipping_status == 1">
					<span @click="call()">联系客服</span>
					<span @click="order_ok(item.order_id)">确认收货</span>
					<span @click="logistics()">查看物流</span>
            </p>
			<!--评论-->
			<p class="all_payment1_p1"  v-if="item.pay_status == 2 && item.shipping_status == 2">
					<span @click="call()">联系客服</span>
					<span @click="logistics()">查看物流</span>
					<span @click="integral(item.order_id)">评价赚积分</span>
            </p>

        </div>
		
        <div class="jia_more" id="page" data-page="1" @click="more()">加载更多</div>
    </div>
</template>
<script>
    import evaluate from './evaluate.vue';
    import receipt  from './receipt.vue';
    import payment from './payment.vue';
    import goods from './goods.vue'

    export default{
        name: 'all',
		data(){
            return{
                orders:[],
				mode:'all'
            }
        },
	    mounted:function(){
			//初始化
			var page    = 1;
			var is_more = 0;
			this.getItems(this.mode,page,is_more);

        },
        methods:{
			call:function(){
				alert("暂未上线,敬请期待");
			},
			order_pay:function(order_id,pay_id){
                if(pay_id == 1){
                    window.location.href="/php/v1/wxPay.php?order_id="+order_id;
                }
                if(pay_id == 2){
                    let url  = this.GLOBAL.BaseUrl+'/mobile/api/v1/Public.php?mode=payCode&order_id='+order_id;
                    let Data = this.GLOBAL.dataParam();
                    this.$ajax.post(url,Data).then((res) =>{
                        let temp = res.data;
                        if(temp.code == 200){
                            window.location.href= "/alipay/aliPay.php?code="+temp.data.code;
                        }else{
                            this.GLOBAL.center_error(this,temp);        
                        }  
                    })
                }
			},
			logistics:function(order_id){
                this.$router.push('/logistics?order_id='+order_id)
            },
			integral:function(order_id){
                this.$router.push('/integral?order_id='+order_id)
            },
			back:function(order_id){
				this.$router.push('/refund?order_id='+order_id);
			},
			getItems:function(mode,page,is_more){
				if(!page || page == 0){
					page = 1;
				}

				let url  = this.GLOBAL.BaseUrl+'/mobile/api/v1/Users.php?mode='+mode+'&page='+page;
                let Data = this.GLOBAL.dataParam();
                
                this.$ajax.post(url,Data).then((res) => {
                    let temp = res.data;
                    if(temp.code == 200){
    					if(is_more){
    						this.GLOBAL.merge_array(this.orders,temp.data);
    						$("#page").attr('data-page',page);
    						
    					}else{
    						this.orders = temp.data;
    					}
					
    				}else{
                         this.GLOBAL.center_error(this,temp);
    				}
                })
			},
			more:function(){

				var page = parseInt($("#page").attr('data-page'));
				page ++;
				var is_more = 1;
				this.getItems(this.mode,page,is_more);

			},
			order_cancel:function(index,order_id){
				
				let url  = this.GLOBAL.BaseUrl+'/mobile/api/v1/Users.php?mode=order_cancel&order_id='+order_id;
                let Data = this.GLOBAL.dataParam();
                
                this.$ajax.post(url,Data).then((res) => {
                    let temp = res.data;
                    if(temp.code == 200){
						this.orders.splice(index,1);
						alert('取消订单成功');
					}else{
						this.GLOBAL.center_error(this,temp);		
					}  
				})				
				
			},
			order_ok:function(order_id){	

				let url  =  this.GLOBAL.BaseUrl+'/mobile/api/v1/Users.php?mode=order_ok&order_id='+order_id;
                let Data = this.GLOBAL.dataParam();
                this.$ajax.post(url,Data).then((res) => {
                    let temp = res.data;
                    if(temp.code == 200){
						alert('确认收货成功');
					}else{
						this.GLOBAL.center_error(this,temp);		
					}  
				})				
				
			},
			order_info:function(order_id,status,order_status){
                if(order_status == 3){
                    return false;
                }
                
				if(status == 2){
					 this.$router.push('/successfulTrade?order_id='+order_id);
				}else{
					 this.$router.push('/Orderdetails?order_id='+order_id);
				}
			},
			order_again:function(order_id){ 

                //再次购买
                let url  = this.GLOBAL.BaseUrl+'/mobile/api/v1/Users.php?mode=order_again&order_id='+order_id;
                let Data = this.GLOBAL.dataParam();
                
                this.$ajax.post(url,Data).then((res) => {
                    let temp = res.data;
                    if(temp.code == 200){
                        alert('购买成功');
                        this.$router.go(0);
                    }else{
                        this.GLOBAL.center_error(this,temp);        
                    }  
                })              
                
            },

        }
    };

</script>
<style>
    .jia_more{
        height:1rem;
        width:100%;
        line-height:1rem;
        text-align:center;
        color:#000000;
        font-size:0.2rem;
    }
    .all_payment1_p1 span{
        width:1.28rem;
        height:0.4rem;
        position:absolute;
        display:block;
        border-radius:0.1rem;
        font-size:0.2rem;
        line-height:0.4rem;
        text-align:center;
    }
    .all_payment1_p1 span:nth-of-type(1){
        color:#828282;
        border:1px solid #aeaeae;
        left:2.01rem;
        top:0.09rem;
    }
    .all_payment1_p1 span:nth-of-type(2){
        color:#828282;
        border:1px solid #aeaeae;
        left:3.45rem;
        top:0.09rem;
    }
    .all_payment1_p1 span:nth-of-type(3){
        color:#ff8811;
        border:1px solid #ff8811;
        left:4.89rem;
        top:0.09rem;
    }
    .all_payment1_p1{
        width: 100%;
        height:0.63rem;
        position:relative;
        /*border-bottom:1px solid #bdbdbd;*/
    }
    .all_payment1_p time{
        color:#ffaa55;
    }
    .all_payment1_p{
        height:0.47rem;
        width:100%;
        line-height:0.47rem;
        color:#3a3939;
        font-size:0.2rem;
        text-indent:3.2rem;
        /*  border-bottom:1px solid #bdbdbd;*/
    }

    .all_payment1_2 img{
        display:block;
        width:1.55rem;
        height:1.56rem;
        margin:0.12rem 0.1rem;
		border-radius:2px;
    }
    .all_payment1_2{
        width:100%;
        height:1.81rem;
        border-bottom:1px solid #cfcecd;
        position:relative;
        display:flex;
		overflow: auto;
    }
    .all_payment1_1 span:nth-of-type(1){
		display:none;
        height:0.24rem;
        width:0.58rem;
        border:1px solid #ffaa55;
        color:#ff9933;
        background:#ffffff;
        position:absolute;
        font-size:0.16rem;
        top:0.19rem;
        left:0.17rem;
        line-height:0.24rem;
        text-align:center;
        border-radius:0.05rem;
    }
    .all_payment1_1 span:nth-of-type(2){
        float:left;
        height:0.61rem;
        width:2.89rem;
        text-align:center;
        line-height:0.61rem;
        color:#636363;
        font-size:0.2rem;
    }
    .all_payment1_1 span:nth-of-type(3){
        height:0.61rem;
        width:1.19rem;
        text-align:center;
        line-height:0.61rem;
        color:#ffaa55;
        font-size:0.23rem;
        font-weight:700;
        float:right;
    }
    .all_payment1_1{
        height:0.61rem;
        width:100%;
        border-bottom:1px solid #cfcecd;
        position:relative;
    }
    .all_payment1{
        height:3.74rem;
        width:100%;
    }
    .all_payment1_border{
        width:100%;
        height:0.12rem;
        background:#f5f4f2;
    }
   /* #all .evaluate_p1{
        border-bottom:0;
    }*/
    .all_payment_p1 span{
        width:1.28rem;
        height:0.4rem;
        position:absolute;
        display:block;
        border-radius:0.1rem;
        font-size:0.2rem;
        line-height:0.4rem;
        text-align:center;
    }
    .all_payment_p1 span:nth-of-type(1){
        color:#828282;
        border:1px solid #aeaeae;
        left:2.01rem;
        top:0.09rem;
    }
    .all_payment_p1 span:nth-of-type(2){
        color:#828282;
        border:1px solid #aeaeae;
        left:3.45rem;
        top:0.09rem;
    }
    .all_payment_p1 span:nth-of-type(3){
        color:#ff8811;
        border:1px solid #ff8811;
        left:4.89rem;
        top:0.09rem;
    }
    .all_payment_p1{
        width: 100%;
        height:0.63rem;
        position:relative;
        /*border-bottom:1px solid #bdbdbd;*/
    }
    .all_payment_p time{
        color:#ffaa55;
    }
    .all_payment_p{
        height:0.47rem;
        width:100%;
        line-height:0.47rem;
        color:#3a3939;
        font-size:0.2rem;
        text-indent:3.2rem;
      /*  border-bottom:1px solid #bdbdbd;*/
    }
    .all_payment_2 span:nth-of-type(1){
        width:5.16rem;
        height:0.47rem;
        line-height:0.47rem;
        text-indent:1.9rem;
        color:#353535;
        font-size:0.22rem;
        display:block;
        padding-top:0.14rem;
    }
    .all_payment_2 span:nth-of-type(2){
        width:5.16rem;
        text-indent: 1.9rem;
        height:0.4rem;
        line-height:0.4rem;
        color:#9e9e9e;
        font-size:0.18rem;
        display:block;
    }
    .all_payment_2 span:nth-of-type(3){
        width:0.8rem;
        height:0.47rem;
        display:block;
        position:absolute;
        line-height:0.47rem;
        text-align:center;
        color:#bdbdbd;
        font-size:0.18rem;
        right:0;
        top:0.13rem;
    }
    .all_payment_2 img{
        display:block;
        width:1.55rem;
        height:1.56rem;
        position:absolute;
        left:0.25rem;
        top:0.12rem;
    }
    .all_payment_2{
        width:100%;
        height:1.81rem;
        border-bottom:1px solid #cfcecd;
        position:relative;
    }
    .all_payment_1 span:nth-of-type(1){
        height:0.24rem;
        width:0.58rem;
        border:1px solid #ffaa55;
        color:#ff9933;
        background:#ffffff;
        position:absolute;
        font-size:0.16rem;
        top:0.19rem;
        left:0.17rem;
        line-height:0.24rem;
        text-align:center;
        border-radius:0.05rem;
    }
    .all_payment_1 span:nth-of-type(2){
        float:left;
        height:0.61rem;
        width:2.89rem;
        text-align:center;
        line-height:0.61rem;
        color:#636363;
        font-size:0.2rem;
    }
    .all_payment_1 span:nth-of-type(3){
        height:0.61rem;
        width:1.19rem;
        text-align:center;
        line-height:0.61rem;
        color:#ffaa55;
        font-size:0.23rem;
        font-weight:700;
        float:right;
    }
    .all_payment_1{
        height:0.61rem;
        width:100%;
        border-bottom:1px solid #cfcecd;
        position:relative;
    }
    .all_payment{
        height:3.74rem;
        width:100%;
    }
    .all_payment_border{
        width:100%;
        height:0.12rem;
        background:#f5f4f2;
    }
    .all_goods_p1 span{
        width:1.28rem;
        height:0.4rem;
        position:absolute;
        display:block;
        border-radius:0.1rem;
        font-size:0.2rem;
        line-height:0.4rem;
        text-align:center;
    }
    .all_goods_p1 span:nth-of-type(1){
        color:#828282;
        border:1px solid #aeaeae;
        left:2.01rem;
        top:0.09rem;
        display:none;
    }
    .all_goods_p1 span:nth-of-type(2){
        color:#828282;
        border:1px solid #aeaeae;
        left:3.45rem;
        top:0.09rem;
    }
    .all_goods_p1 span:nth-of-type(3){
        color:#828282;
        border:1px solid #828282;
        left:4.89rem;
        top:0.09rem;
    }
    .all_goods_p1{
        width: 100%;
        height:0.63rem;
        position:relative;
       /* border-bottom:1px solid #bdbdbd;*/
    }
    .all_goods_p time{
        color:#ffaa55;
    }
    .all_goods_p{
        height:0.47rem;
        width:100%;
        line-height:0.47rem;
        color:#3a3939;
        font-size:0.2rem;
        text-indent:3.2rem;
        /*border-bottom:1px solid #bdbdbd;*/
    }
    .all_goods_2 span:nth-of-type(1){
        width:5.16rem;
        height:0.47rem;
        line-height:0.47rem;
        text-align:center;
        color:#353535;
        font-size:0.22rem;
        display:block;
        margin-top:0.14rem;
    }
    .all_goods_2 span:nth-of-type(2){
        width:5.16rem;
        text-align:center;
        height:0.4rem;
        line-height:0.4rem;
        color:#9e9e9e;
        font-size:0.18rem;
        display:block;
    }
    .all_goods_2 span:nth-of-type(3){
        width:0.8rem;
        height:0.47rem;
        display:block;
        position:absolute;
        line-height:0.47rem;
        text-align:center;
        color:#bdbdbd;
        font-size:0.18rem;
        right:0;
        top:0.13rem;
    }
    .all_goods_2 img{
        display:block;
        width:1.55rem;
        height:1.56rem;
        position:absolute;
        left:0.25rem;
        top:0.12rem;
    }
    .all_goods_2{
        width:100%;
        height:1.81rem;
        border-bottom:1px solid #cfcecd;
        position:relative;
    }
    .all_goods_1 span:nth-of-type(1){
        height:0.24rem;
        width:0.58rem;
        border:1px solid #c8d3b2;
        color:#c8d3b2;
        background:#ffffff;
        position:absolute;
        font-size:0.16rem;
        top:0.19rem;
        left:0.17rem;
        line-height:0.24rem;
        text-align:center;
        border-radius:0.05rem;
    }
    .all_goods_1 span:nth-of-type(2){
        float:left;
        height:0.61rem;
        width:2.89rem;
        text-align:center;
        line-height:0.61rem;
        color:#636363;
        font-size:0.2rem;
    }
    .all_goods_1 span:nth-of-type(3){
        height:0.61rem;
        width:1.19rem;
        text-align:center;
        line-height:0.61rem;
        color:#ffaa55;
        font-size:0.23rem;
        font-weight:700;
        float:right;
    }
    .all_goods_1{
        height:0.61rem;
        width:100%;
        border-bottom:1px solid #cfcecd;
        position:relative;
    }
    .all_goods{
        height:3.74rem;
        width:100%;
    }
    .all_goods_border{
        width:100%;
        height:0.12rem;
        background:#f5f4f2;
    }
    .all_receipt_p1 span{
        width:1.28rem;
        height:0.4rem;
        position:absolute;
        display:block;
        border-radius:0.1rem;
        font-size:0.2rem;
        line-height:0.4rem;
        text-align:center;
    }
    .all_receipt_p1 span:nth-of-type(1){
        color:#828282;
        border:1px solid #aeaeae;
        left:2.01rem;
        top:0.09rem;
    }
    .all_receipt_p1 span:nth-of-type(2){
        color:#828282;
        border:1px solid #aeaeae;
        left:3.45rem;
        top:0.09rem;
    }
    .all_receipt_p1 span:nth-of-type(3){
        color:#ff8811;
        border:1px solid #ff8811;
        left:4.89rem;
        top:0.09rem;
    }
    .all_receipt_p1{
        width: 100%;
        height:0.63rem;
        position:relative;
       /* border-bottom:1px solid #bdbdbd;*/
    }
    .all_receipt_p time{
        color:#ffaa55;
    }
    .all_receipt_p{
        height:0.47rem;
        width:100%;
        line-height:0.47rem;
        color:#3a3939;
        font-size:0.2rem;
        text-indent:3.2rem;
        /*border-bottom:1px solid #bdbdbd;*/
    }
    .all_receipt_2 span:nth-of-type(1){
        width:5.16rem;
        height:0.47rem;
        line-height:0.47rem;
        text-align:center;
        color:#353535;
        font-size:0.22rem;
        display:block;
        margin-top:0.14rem;
    }
    .all_receipt_2 span:nth-of-type(2){
        width:5.16rem;
        text-align:center;
        height:0.4rem;
        line-height:0.4rem;
        color:#9e9e9e;
        font-size:0.18rem;
        display:block;
    }
    .all_receipt_2 span:nth-of-type(3){
        width:0.8rem;
        height:0.47rem;
        display:block;
        position:absolute;
        line-height:0.47rem;
        text-align:center;
        color:#bdbdbd;
        font-size:0.18rem;
        right:0;
        top:0.13rem;
    }
    .all_receipt_2 img{
        display:block;
        width:1.55rem;
        height:1.56rem;
        position:absolute;
        left:0.25rem;
        top:0.12rem;
    }
    .all_receipt_2{
        width:100%;
        height:1.81rem;
        border-bottom:1px solid #cfcecd;
        position:relative;
    }
    .all_receipt_1 span:nth-of-type(1){
        height:0.24rem;
        width:0.58rem;
        border:1px solid #758f3d;
        color:#758f3d;
        background:#ffffff;
        position:absolute;
        font-size:0.16rem;
        top:0.19rem;
        left:0.17rem;
        line-height:0.24rem;
        text-align:center;
        border-radius:0.05rem;
    }
    .all_receipt_1 span:nth-of-type(2){
        float:left;
        height:0.61rem;
        width:2.89rem;
        text-align:center;
        line-height:0.61rem;
        color:#636363;
        font-size:0.2rem;
    }
    .all_receipt_1 span:nth-of-type(3){
        height:0.61rem;
        width:1.19rem;
        text-align:center;
        line-height:0.61rem;
        color:#ffaa55;
        font-size:0.23rem;
        font-weight:700;
        float:right;
    }
    .all_receipt_1{
        height:0.61rem;
        width:100%;
        border-bottom:1px solid #cfcecd;
        position:relative;
    }
    .all_receipt{
        height:3.74rem;
        width:100%;
    }
    .all_receipt_border{
        width:100%;
        height:0.12rem;
        background:#f5f4f2;
    }
    .all_evaluate_p1 span{
        width:1.28rem;
        height:0.4rem;
        position:absolute;
        display:block;
        border-radius:0.1rem;
        font-size:0.2rem;
        line-height:0.4rem;
        text-align:center;
    }
    .all_evaluate_p1 span:nth-of-type(1){
        color:#828282;
        border:1px solid #aeaeae;
        left:2.01rem;
        top:0.09rem;
        display:none;
    }
    .all_evaluate_p1 span:nth-of-type(2){
        color:#828282;
        border:1px solid #aeaeae;
        left:3.45rem;
        top:0.09rem;
        display:none;
    }
    .all_evaluate_p1 span:nth-of-type(3){
        color:#ff8811;
        border:1px solid #ff8811;
        left:4.89rem;
        top:0.09rem;
    }
    .all_evaluate_p1{
        width: 100%;
        height:0.63rem;
        position:relative;
       /* border-bottom:1px solid #bdbdbd;*/
    }
    .all_evaluate_p time{
        color:#ffaa55;
    }
    .all_evaluate_p{
        height:0.47rem;
        width:100%;
        line-height:0.47rem;
        color:#3a3939;
        font-size:0.2rem;
        text-indent:3.2rem;
       /* border-bottom:1px solid #bdbdbd;*/
    }
    .all_evaluate_2 span:nth-of-type(1){
        width:5.16rem;
        height:0.47rem;
        line-height:0.47rem;
        text-align:center;
        color:#353535;
        font-size:0.22rem;
        display:block;
        margin-top:0.14rem;
    }
    .all_evaluate_2 span:nth-of-type(2){
        width:5.16rem;
        text-align:center;
        height:0.4rem;
        line-height:0.4rem;
        color:#9e9e9e;
        font-size:0.18rem;
        display:block;
    }
    .all_evaluate_2 span:nth-of-type(3){
        width:0.8rem;
        height:0.47rem;
        display:block;
        position:absolute;
        line-height:0.47rem;
        text-align:center;
        color:#bdbdbd;
        font-size:0.18rem;
        right:0;
        top:0.13rem;
    }
    .all_evaluate_2 img{
        display:block;
        width:1.55rem;
        height:1.56rem;
        position:absolute;
        left:0.25rem;
        top:0.12rem;
    }
    .all_evaluate_2{
        width:100%;
        height:1.81rem;
        border-bottom:1px solid #cfcecd;
        position:relative;
    }
    .all_evaluate_1 span:nth-of-type(1){
        height:0.24rem;
        width:0.58rem;
        border:1px solid #758f3d;
        color:#758f3d;
        background:#ffffff;
        position:absolute;
        font-size:0.16rem;
        top:0.19rem;
        left:0.17rem;
        line-height:0.24rem;
        text-align:center;
        border-radius:0.05rem;
    }
    .all_evaluate_1 span:nth-of-type(2){
        float:left;
        height:0.61rem;
        width:2.89rem;
        text-align:center;
        line-height:0.61rem;
        color:#636363;
        font-size:0.2rem;
    }
    .all_evaluate_1 span:nth-of-type(3){
        height:0.61rem;
        width:1.19rem;
        text-align:center;
        line-height:0.61rem;
        color:#ffaa55;
        font-size:0.23rem;
        font-weight:700;
        float:right;
    }
    .all_evaluate_1{
        height:0.61rem;
        width:100%;
        border-bottom:1px solid #cfcecd;
        position:relative;
    }
    .all_evaluate{
        height:3.74rem;
        width:100%;
    }
    .all_evaluate_border{
        width:100%;
        height:0.12rem;
        background:#f5f4f2;
    }
</style>